<!DOCTYPE html>
<html lang="en">

<head>

    {{template "common/head.html" .}}

    <style type="text/css">
        .page-security-history {
            position: relative;
            padding: 28px 0 80px 40px;
            height: 100%;
        }

        .page-security-history-container {
            height: 100%;
        }

        .page-security-history .bg {
            position: absolute;
            width: 200px;
            height: auto;
            right: 0;
            top: 0;
        }

        .page-security-history-class-members {
            margin: -10px;
            -webkit-flex-wrap: wrap;
            -ms-flex-wrap: wrap;
            flex-wrap: wrap;
            -webkit-box-flex: 1;
            -webkit-flex: 1;
            -ms-flex: 1;
            flex: 1;
            overflow: scroll;
        }

        .page-security-history-student {
            -webkit-box-flex: 0;
            -webkit-flex: 0 0 20%;
            -ms-flex: 0 0 20%;
            flex: 0 0 20%;
            margin-bottom: 10px;
        }

        .page-security-history-student-avatar {
            position: relative;
            width: 45px;
            height: 45px;
            border-radius: 100%;
            background-color: #fff;
            margin: 0 auto;
            overflow: hidden;
        }

        .page-security-history-student.disabled .page-security-history-student-avatar::after {
            content: '';
            position: absolute;
            left: 0;
            right: 0;
            top: 0;
            bottom: 0;
            background-color: rgba(255, 255, 255, 0.5);
        }

        .page-security-history-student.disabled .page-security-history-student-name {
            color: #595959;
        }

        .page-security-history-student-avatar img {
            position: absolute;
            width: 35px;
            height: 35px;
            left: 5px;
            top: 5px;
        }

        .page-security-history-class-list {
            position: relative;
        }

        .page-security-history-class-number {
            position: absolute;
            top: 0;
            right: 0;
            height: 26px;
            line-height: 26px;
            border-top-left-radius: 13px;
            border-bottom-left-radius: 13px;
            -webkit-box-shadow: 3px 2px 9px 0px rgba(145, 124, 24, 0.49);
            box-shadow: 3px 2px 9px 0px rgba(145, 124, 24, 0.49);
            background-color: #fff;
            padding: 0 15px;
        }
    </style>
</head>

<body>
<div class="page-main">
    <div class="page-main-container">
        <div flex="dir:top" class="child-view page-security-history">
            <img src="/static/front/images/bg2.png" alt="" srcset="" class="bg">
            <div class="ui-text-28 ui-title-color ui-mg-b-26 page-security-history-title">体温监测</div>
            <div class="page-security-history-container">
                {{range .classList}}
                    <div class="page-security-history-class-list">
                        <div class="ui-mg-b-28 page-security-history-class-item">
                            <div flex="cross:bottom" class="ui-mg-b-24 page-security-history-class-member-count"><span
                                        class="ui-text-24">班级成员</span><span class="ui-text-14">（共{{.StudentNum}}人）</span></div>
                            <div class="ui-text-18 page-security-history-class-number">{{.Name}}</div>
                            <div flex="" class="no-scrollbar ui-pd-r-28 page-security-history-class-members">
                                {{range .StudentList}}
                                    <div class="page-security-history-student {{if eq .TempIsNormal 0}}disabled{{end}}" onclick="location.href='{{urlfor "teacher.TempNoticeController.Detail" ":id" .Id}}'">
                                        <div class="page-security-history-student-avatar">
                                            <img src="/static/front/images/1.png" alt="">
                                        </div>
                                        <div class="ui-text-center page-security-history-student-name">
                                            {{.RealName}}
                                        </div>
                                    </div>
                                {{end}}
                            </div>
                        </div>
                    </div>
                {{end}}
            </div>
        </div>
    </div>
</div>
</body>
</html>